/* eslint-disable no-unused-vars */
/* eslint-disable class-methods-use-this */
/* eslint-disable import/no-cycle */
/* eslint-disable react/no-danger */
import React from 'react';
import { Tabs, Form, Input, Select } from 'antd';
import BaseControl from './BaseControl';
import DesignForm from '../designForm';
import ApiHelper from '../api';
import DesignUtil from '../common/DesignUtil';

const { TabPane } = Tabs;
const { Option } = Select;

/**
 * 表单控件
 */
class SubFormControl extends BaseControl {
  static create(props, dataProps, extProps) {
    return new SubFormControl(props, dataProps, extProps);
  }

  constructor(props, dataProps, extProps) {
    const dataProps2 = {
      title: '子表单',
      type: 'SubForm',
      formKey: '',
      widthPercent: 100,
      ...dataProps,
    };
    super(props, dataProps2, extProps);
    this.name = '子表单';
    // this.icon = '';
    this.designFormDom = null;
    this.tempKey = `sub_${DesignUtil.UUID()}`;
  }

  getJsonValue(jsonValues) {
    if (this.designFormDom != null) {
      jsonValues.push({
        key: this.data.key,
        title: this.data.title,
        value: this.designFormDom.getJsonValue(),
        type: this.data.type,
      });
    }
  }

  setJsonValue(jsonValues) {
    const find = jsonValues.find((c) => c.key === this.data.key);
    if (find != null && this.designFormDom != null) {
      this.designFormDom.setJsonValue(find.value);
    }
  }

  getPropertyTabs(parentForm) {
    return [
      ...super.getPropertyTabs(parentForm),
      <TabPane tab="控件配置" key="3">
        <Form.Item label="子表单">
          <Select
            defaultValue={this.data.formKey}
            value={this.data.formKey}
            onChange={(event) => {
              this.data.formKey = event;
              this.tempKey = `sub_${DesignUtil.UUID()}`;
              parentForm.refreash();
            }}
          >
            <Option value="">无</Option>
            {parentForm.subForms.map((c, index) => {
              const key = `subform${index}`;
              if (c.form_key === parentForm.useformData.formkey) {
                return <></>;
              }
              return (
                <Option key={key} value={c.form_key}>
                  {c.form_name}
                </Option>
              );
            })}
          </Select>
        </Form.Item>
      </TabPane>,
    ];
  }

  getDesignControl(parentForm) {
    return this.data.formKey === '' ? (
      <></>
    ) : (
      <DesignForm
        key={this.tempKey}
        ref={(r) => {
          this.designFormDom = r;
        }}
        formkey={this.data.formKey}
        formtype={2}
        formelement="div"
        subform="true"
        {...this.extProps}
      />
    );
  }
}

export default SubFormControl;
